<script setup lang="ts">
defineProps({
  title: {type: String, required: true},
});
</script>

<template>
  <div class="red">
    <p class="title">{{title}}</p>
    <slot/>
  </div>
</template>

<style scoped>
.title{font-weight: bold;color: #ed3c50}
.red {
  border: 1px solid #ed3c50;
  padding: 10px;
  background-color: #f9f9f9;
  border-radius: 8px;
  transition: color .5s,background-color .5s;
  margin: 10px 0;
  color: #0000008c;
}
</style>